var tipsImg = 'https://ngp-cloud.oss-cn-shenzhen.aliyuncs.com/prod/2025-04-28/48811337e3800d362492.png'
var img = 'https://crm-album.oss-cn-shenzhen.aliyuncs.com/prod/2025/3/31/875319b978b21899778e.jpg'
var zoom = 2.4
var centerX = 108.194115019531
var aspectScale = 1 // 调整地图的宽高比，使其更扁平
var roam = false
export default {
  //数据提示框
  tooltip: {
    trigger: 'item',
    showDelay: 0,
    hideDelay: 0,
    enterable: false,
    //backgroundColor: '#000',
    padding: 0,
    borderWidth: 0,
    borderColor: '#ccc',
    formatter: function (params) {
      if (params.seriesType === 'effectScatter') {
        return `<div style="width:160px;height:94px;background-image:url(${tipsImg}); background-size: cover;position: absolute;top: -122px;left:-60px;padding:25px 20px">
                  <p style="margin:0;font-size:12px;color:#fff;font-weight:700">${params.data.name}：${params.data.projectCount}家</p>
                  <p style="margin:0;font-size:12px;;color:#ABF8FF;font-weight:700;">售储综合收益：${params.data.projectInc}</p>
                </div>`;
      }
      return '';
    },
    confine: true
  },
  geo: [
    //地图阴影
    {
      type: 'map',
      map: 'china',
      zoom: zoom,
      aspectScale: aspectScale, // 调整地图的宽高比，使其更扁平
      roam: false,
      zlevel: 3, // 设置地图的层级，将该地图上移（类似z-index）
      animationDurationUpdate: 0,//实现缩放、拖动同步且不卡顿
      scaleLimit: { //滚轮缩放的极限控制
        min: zoom,
      },
      layoutCenter: ["50%", "50%"],
      layoutSize: "180%",
      silent: true,
      emphasis: {
        // 鼠标hover是否显示内容，可自己调节
        label: {
          show: false,
          color: '#fff',
        },
        itemStyle: {
          show: true,
          color: '#fff', // 高亮文字颜色
          borderColor: '#f43c24', // 高亮边框颜色
          areaColor: '#f47c84', //高亮区域颜色
        },
      },
      label: {
        // 地图标注
        show: true, // 是否显示对应地名
        //由于鼠标放在地图上时，省份字体颜色会有一个从默认色到红色的颜色跳动，所以即使normal时省份字体不显示，也设置为红色，视觉优化颜色跳动问题
        color: '#b0e7fc',
      },
      /* itemStyle: {
        borderColor: '#00effe', // 省份边框颜色
        borderWidth: 1.5, // 省份边框宽度
        shadowColor: '#fff', // 省份边框阴影rgba(100,255,238,0.5)
        shadowBlur: 5, // 省份边框聚焦
        areaColor: '#184b91',
      }, */
      itemStyle: {
        normal: {
          areaColor: {
            type: 'linear-gradient',
            x: 0,
            y: 350,
            x2: 400,
            y2: 0,
            colorStops: [{
              offset: 0,
              color: 'rgba(18,54,121,0.85)'
            }, {
              offset: 1,

              color: 'rgba(40,123,192,0.85)'

            }],
            global: true // 缺省为 false


          },


          borderColor: '#a0cbee', // 省份边框颜色
          borderWidth: 1.5, // 省份边框宽度
          shadowColor: 'rgba(18,18,18,0.4)', // 省份边框阴影rgba(100,255,238,0.5)
          shadowBlur: 1, // 省份边框聚焦
        },

      },
      center: [113.280637, 23], // 设置地图中心

      data: [],
      regions: [{ // 隐藏南海诸岛
        name: '南海诸岛',
        itemStyle: {
          opacity: 0,
          fontSize: 0,
        }
      }],

    },
    {
      // 边框设置
      map: 'china', // 表示中国地图

      label: {
        // 标志信息
        show: false, // 是否显示对应地名
      },
      zlevel: 2,
      roam: roam, // 禁止拖拽
      scaleLimit: { //滚轮缩放的极限控制
        min: zoom,
      },
      animationDurationUpdate: 0,//实现缩放、拖动同步且不卡顿
      silent: true, // 禁止hover效果
      zoom: zoom, // 地图比例
      aspectScale: aspectScale,
      center: [113.280637, 23], // 地图中心位置， 此处的纬度与下面的center相差1度是形成阴影的距离，可自己随意调整
      layoutSize: "180%",
      layoutCenter: ["50%", "50%"],
      itemStyle: {
        areaColor: {
          image: img, // 背景图
          repeat: 'repeat-x', // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'
        },
      },
      regions: [{ // 隐藏南海诸岛
        name: '南海诸岛',
        itemStyle: {
          opacity: 0,
        }
      }],
    },
    {
      map: 'china', // 表示中国地图
      roam: roam, // 禁止拖拽
      label: {
        // 标志信息
        show: false, // 是否显示对应地名
      },
      zlevel: 1,
      scaleLimit: { //滚轮缩放的极限控制
        min: zoom,
      },

      animationDurationUpdate: 0,
      silent: true, // 禁止hover效果
      zoom: zoom, // 地图比例
      aspectScale: aspectScale,
      center: [113.280637, 23], // 地图中心位置， 此处的纬度与下面的center相差1度是形成阴影的距离，可自己随意调整
      layoutSize: "180%",
      layoutCenter: ["50%", "50%"],
      itemStyle: {
        areaColor: 'rgba(1,52,122,0.2)', //地图阴影的颜色

        borderColor: '#fff', // 省份边框颜色
        borderWidth: 3, // 省份边框宽度
        shadowColor: '#c9f3fe', // 省份边框阴影rgba(100,255,238,0.5)
        shadowBlur: 3, // 省份边框聚焦
      },
      /* emphasis: {
        show: false,
      }, */
      regions: [{ // 隐藏南海诸岛
        name: '南海诸岛',
        itemStyle: {
          opacity: 0,
        }
      }],
    },
    {
      map: 'china', // 表示中国地图
      roam: roam, // 禁止拖拽
      label: {
        // 标志信息
        show: false, // 是否显示对应地名
      },
      zlevel: 1,
      scaleLimit: { //滚轮缩放的极限控制
        min: zoom,
      },

      animationDurationUpdate: 0,
      silent: true, // 禁止hover效果
      zoom: zoom, // 地图比例
      aspectScale: aspectScale,
      center: [113.280637, 23], // 地图中心位置， 此处的纬度与下面的center相差1度是形成阴影的距离，可自己随意调整
      layoutSize: "180%",
      layoutCenter: ["50%", "52%"],
      itemStyle: {
        areaColor: 'rgba(1,52,122,0.2)', //地图阴影的颜色
        /* areaColor: {
          image: img, // 背景图
          repeat: 'repeat-x', // 是否平铺，可以是 'repeat-x', 'repeat-y', 'no-repeat'
        }, */
        borderColor: '#fff', // 省份边框颜色
        borderWidth: 0, // 省份边框宽度
        shadowColor: '#c9f3fe', // 省份边框阴影rgba(100,255,238,0.5)
        shadowBlur: 1, // 省份边框聚焦
      },
      /* emphasis: {
        show: false,
      }, */
      regions: [{ // 隐藏南海诸岛
        name: '南海诸岛',
        itemStyle: {
          opacity: 0,
        }
      }],
    },
  ],
  //配置属性
  series: [
    {
      type: 'map',
      map: 'china',
      zoom: zoom,
      aspectScale: aspectScale, // 调整地图的宽高比，使其更扁平
      roam: roam,
      zlevel: 1, // 设置地图的层级，将该地图上移（类似z-index）
      silent: true,
      emphasis: {
        // 鼠标hover是否显示内容，可自己调节
        label: {
          show: true,
          color: '#fff',
        },
        itemStyle: {
          show: true,
          color: '#fff', // 高亮文字颜色
          borderColor: '#f43c24', // 高亮边框颜色
          areaColor: '#f47c84', //高亮区域颜色
        },
      },
      label: {
        // 地图标注
        show: false, // 是否显示对应地名
        //由于鼠标放在地图上时，省份字体颜色会有一个从默认色到红色的颜色跳动，所以即使normal时省份字体不显示，也设置为红色，视觉优化颜色跳动问题
        color: '#000',
      },
      // 配置 labelLine
      labelLine: {
        show: true, // 显示标签线
        lineStyle: {
          color: '#aaa', // 标签线颜色
          width: 1, // 标签线宽度
          type: 'solid' // 标签线类型
        }
      },
      itemStyle: {
        normal: {
          areaColor: {
            type: 'linear-gradient',
            x: 0,
            y: 350,
            x2: 0,
            y2: 0,
            colorStops: [{
              offset: 0,
              color: 'rgba(18,54,121,0.85)'
            }, {
              offset: 1,

              color: 'rgba(40,123,192,0.85)'

            }],
            global: true // 缺省为 false


          },


          borderColor: '#a0cbee', // 省份边框颜色
          borderWidth: 1.5, // 省份边框宽度
          shadowColor: 'rgba(18,18,18,0.4)', // 省份边框阴影rgba(100,255,238,0.5)
          shadowBlur: 1, // 省份边框聚焦
        },

      },
      center: [centerX, 36], // 设置地图中心
      data: [],

    },
    //柱状体的主干
    {
      type: 'lines',
      zlevel: 5,
      effect: {
        show: false,
        symbolSize: 5 // 图标大小
      },
      lineStyle: {
        width: 1, // 尾迹线条宽度
        color: '#fff45c',
        opacity: 1, // 尾迹线条透明度
        curveness: 0 // 尾迹线条曲直度
      },
      label: {
        show: 0,
        position: 'end',
        formatter: '245'
      },
      silent: true,
      data: []
    },
    // 提示框
    {
      type: 'scatter',
      coordinateSystem: 'geo',
      geoIndex: 0,
      zlevel: 5,

      label: {
        normal: {
          show: true,
          formatter: function (params) {
            var name = params.data[2].cityName
            var value = params.data[2].projectCount
            var text = `{cityName|${name}}  {fline|${value}家用户}\n{inc|储售总收益}  {incNum|${value}家用户}`
            /*  return [
               '{cityName|' + name + '}',
               '{count|' + value + '个}'
             ].join('\n'); */
            return text
          },

          rich: {
            cityName: {
              color: '#fff',
              fontSize: 12,
              padding: [0, 0, 10, 15],
              width: 70,
              fontWeight: 600,
            },
            fline: {
              color: '#fff',
              fontSize: 12,

              padding: [2, 0, 10, 0]
            },
            inc: {
              color: '#ABF8FF',
              fontSize: 12,
              fontWeight: 600,
              width: 70,
              padding: [2, 0, 0, 15]
            },
            incNum: {
              color: '#ABF8FF',
              fontSize: 12,
              fontWeight: 600,
              width: 70,
              padding: [2, 0, 0, 0]
            }
          }
        },
        emphasis: {
          disabled: true,
          show: true
        }
      },
      itemStyle: {
        color: 'transparent',
        opacity: 1
      },
      symbol: tipsImg,
      symbolSize: [160, 94],
      symbolOffset: function (data) {

        /* if (data[2].provName === '浙江省') {
          return [0, 10]
        } else if (data[2].provName === '江苏省') {
          return [0, -30]
        } else {
          return [0, -20]
        } */

      },
      z: 999,
      data: [],
    },
    //点位
    {
      name: '',
      type: 'effectScatter',
      coordinateSystem: 'geo',
      data: [],
      showEffectOn: 'render',
      itemStyle: {
        normal: {
          color: '#f9690d',
        }
      },
      rippleEffect: {
        scale: 3,
        brushType: 'stroke',
      },
      label: {
        normal: {
          formatter: '{b}',
          position: 'bottom',
          show: false,
          color: "#fff",
          distance: 10,
        },
      },
      symbol: 'circle',
      symbolSize: [10, 4], // 将点的大小调整为更小的值
      itemStyle: {
        normal: {
          color: '#fff45c',
          shadowBlur: 10,
          shadowColor: '#fff45c',
        },
        opacity: 1
      },
      zlevel: 4,
    },
  ],
}